//type:1, //类型 0为直线 1为向下折线 2为向上折线  3为弯曲折线
//lineColor:"#C2C1C6", //线颜色
//speed:10, //动画时间
//flow0color:'rgba(255,255,255,1)', //移动光电渐变内部颜色
//flow1color:'rgba(255,255,255,0)', //渐变外部颜色
//arrow:false, //是否带箭头
//beginCallbak:function(){}, //光电开始移动回调
//endCallbak:function(){}  //光电移动结束回调
//beginAnimation(ifone) ifone 是否执行一次动画
//delAnimation(ifsg) ifsg 光点是否从头开始
//flowLine.delParameter 设置全局参数
;(function($,document){
	var doc = $(document);
	
	//straightLine 直线 0
	var StraightLine = function (newpro,canvas){ 
        this.onex = 1;
        this.lineColor = newpro.lineColor;
        this.flow0color = newpro.flow0color;
        this.flow1color = newpro.flow1color;
        this.canvas = canvas;
        this.sinter = null;
        this.arrow = newpro.arrow;
        this.speed = newpro.speed;
        this.beginCallbak = newpro.beginCallbak;
    	this.endCallbak=newpro.endCallbak;
    } 
    StraightLine.prototype = 
    { 
        constructor : StraightLine, 
        g : null,
        init : function () 
        { 
            this.g = this.canvas.getContext ("2d"); 
            return this; 
        }, 
        //ifsg 是否从头开始
        delAnimation:function(ifsg){
        	clearInterval(this.sinter);
        	if(ifsg){
            	this.onex=1;
            }
        	this.drawEyelid(ifsg);
        	return this;
        },
        beginAnimation:function(ifone){
        	var mythis = this;
        	this.delAnimation(true);
        	this.sinter = setInterval(function(){
	        	mythis.drawEyelid(true,ifone);
	        }, this.speed);
	        return this;
        },
        drawEyelid : function (ifsg,ifone) 
        { 
            var g = this.g, a = this.a, R = 5,width = this.canvas.width,height = this.canvas.height; 
            var w = width-9,h=height/2;
            g.beginPath (); 
            g.strokeStyle = this.lineColor; 
            //"#5CB93C"
            g.moveTo (0, h); 
            g.lineTo (w, h);
            g.stroke (); 
            g.restore (); 
            if(this.arrow){
            	g.beginPath (); 
	            g.fillStyle = this.lineColor; 
	            g.moveTo (w, h+4); 
	            g.lineTo (w, h-4); 
	            g.lineTo (width-4, h); 
	            g.fill (); 
	            g.restore (); 
            }
            if(ifsg && this.onex==1)this.beginCallbak();
            if(ifsg && this.onex+10 < w){
            	this.onex++;
            	var gnt = g.createRadialGradient(this.onex+8,h,1,6+this.onex,h,15);
            	gnt.addColorStop(1,this.flow1color);
            	//'rgba(255,255,255,0)'
            	gnt.addColorStop(0,this.flow0color);
            	//'rgba(255,255,255,1)'
            	BezierEllipse2(gnt,g, this.onex, h, 10, 1);
            }else{
            	if(ifsg)this.endCallbak();
            	if(ifone)this.delAnimation(!ifone);
            	this.onex=1;
            }
        } 
    }; 
	//rightAngleLine 直角线 1
	var RightAngleLine = function (newpro,canvas){ 
        this.onex = 1;
        this.oney = 1;
        this.lineColor = newpro.lineColor;
        this.flow0color = newpro.flow0color;
        this.flow1color = newpro.flow1color;
        this.canvas = canvas;
        this.sinter = null;
        this.arrow = newpro.arrow;
        this.speed = newpro.speed;
        this.beginCallbak = newpro.beginCallbak;
    	this.endCallbak=newpro.endCallbak;
    } 
    RightAngleLine.prototype = 
    { 
        constructor : RightAngleLine, 
        g : null,
        init : function () 
        { 
            this.g = this.canvas.getContext ("2d"); 
            return this; 
        },
        drawEyelid : function (ifsg,ifone) 
        { 
            var g = this.g, a = this.a, R = 5,width = this.canvas.width,height = this.canvas.height; 
            var w = width-5,h=height-9;
            g.beginPath (); 
            g.strokeStyle = this.lineColor; 
            //"#5CB93C"
            g.moveTo (0, 1); 
            g.lineTo (w, 1); 
            g.lineTo (w, h);
            g.stroke (); 
            g.restore (); 
            if(this.arrow){
            	g.beginPath (); 
	            g.fillStyle = this.lineColor; 
	            g.moveTo (width-9, h); 
	            g.lineTo (width-1, h); 
	            g.lineTo (w, height-4); 
	            g.fill (); 
	            g.restore (); 
            }
            if(ifsg && this.onex==1 && this.oney==1)this.beginCallbak();
            if(ifsg && this.onex+10 < w && this.oney < h){
            	this.onex++;
            	var gnt = g.createRadialGradient(this.onex+8,1,1,6+this.onex,1,15);
            	gnt.addColorStop(1,this.flow1color);
            	//'rgba(255,255,255,0)'
            	gnt.addColorStop(0,this.flow0color);
            	//'rgba(255,255,255,1)'
            	BezierEllipse2(gnt,g, this.onex, 1, 10, 1);
            }else if(ifsg && this.onex+10 >= w && this.oney < h-10){
            	this.oney++;
            	var gnt = g.createRadialGradient(this.onex+10,10+this.oney-3,1,this.onex+10,this.oney,10);
            	gnt.addColorStop(1,this.flow1color);
            	//'rgba(255,255,255,0)'
            	gnt.addColorStop(0,this.flow0color);
            	//'rgba(255,255,255,1)'
            	BezierEllipse(gnt,g,this.onex+10,10+this.oney, 15, 1);
            }else{
            	if(ifsg)this.endCallbak();
            	if(ifone)this.delAnimation(!ifone);
            	this.onex=1;
            	this.oney=1;
            }
        }, 
        delAnimation:function(ifsg){
        	clearInterval(this.sinter);
        	if(ifsg){
            	this.onex=1;
            	this.oney=1;
            }
        	this.drawEyelid(ifsg);
        	return this;
        },
        beginAnimation:function(ifone){
        	var mythis = this;
        	this.delAnimation(true);
        	this.sinter = setInterval(function(){
	        	mythis.drawEyelid(true,ifone);
	        }, this.speed);
	        return this;
        } 
    }; 
    //Discount 折线 2
    var Discount = function (newpro,canvas){ 
        this.onex = 1;
        this.oney = 1;
        this.lineColor = newpro.lineColor;
        this.flow0color = newpro.flow0color;
        this.flow1color = newpro.flow1color;
        this.canvas = canvas;
        this.sinter = null;
        this.arrow = newpro.arrow;
        this.speed = newpro.speed;
        this.beginCallbak = newpro.beginCallbak;
    	this.endCallbak=newpro.endCallbak;
    } 
    Discount.prototype = 
    { 
        constructor : Discount, 
        g : null,
        init : function () 
        { 
            this.g = this.canvas.getContext ("2d"); 
            return this; 
        },
        drawEyelid : function (ifsg,ifone) 
        { 
            var g = this.g, a = this.a, R = 5,width = this.canvas.width,height = this.canvas.height; 
            var w = width-4,h=6;
            g.beginPath (); 
            g.strokeStyle = this.lineColor; 
            //"#5CB93C"
            g.moveTo (0, height-1); 
            g.lineTo (w, height-1); 
            g.lineTo (w, h);
            g.stroke (); 
            g.restore (); 
            if(this.arrow){
            	g.beginPath (); 
	            g.fillStyle = this.lineColor; 
	            g.moveTo (width, h); 
	            g.lineTo (width-8, h); 
	            g.lineTo (w, 0); 
	            g.fill (); 
	            g.restore (); 
            }
            if(ifsg && this.onex==1 && this.oney==1)this.beginCallbak();
            if(ifsg && this.onex+10 < w && height-this.oney > h){
            	this.onex++;
            	var gnt = g.createRadialGradient(this.onex+8,height-1,1,6+this.onex,height-1,15);
            	gnt.addColorStop(1,this.flow1color);
            	//'rgba(255,255,255,0)'
            	gnt.addColorStop(0,this.flow0color);
            	//'rgba(255,255,255,1)'
            	BezierEllipse2(gnt,g, this.onex, height-1, 10, 1);
            }else if(ifsg && this.onex+10 >= w && height-this.oney > h+10){
            	this.oney++;
            	var gnt = g.createRadialGradient(this.onex+10,height-10-this.oney+3,1,this.onex+10,height-this.oney,10);
            	gnt.addColorStop(1,this.flow1color);
            	//'rgba(255,255,255,0)'
            	gnt.addColorStop(0,this.flow0color);
            	//'rgba(255,255,255,1)'
            	BezierEllipse(gnt,g,this.onex+10,height-10-this.oney, 15,1);
            }else{
            	if(ifsg)this.endCallbak();
            	if(ifone)this.delAnimation(!ifone);
            	this.onex=1;
            	this.oney=1;
            }
        }, 
        delAnimation:function(ifsg){
        	clearInterval(this.sinter);
        	if(ifsg){
            	this.onex=1;
            	this.oney=1;
            }
        	this.drawEyelid(ifsg);
        	return this;
        },
        beginAnimation:function(ifone){
        	var mythis = this;
        	this.delAnimation(true);
        	this.sinter = setInterval(function(){
	        	mythis.drawEyelid(true,ifone);
	        }, this.speed);
	        return this;
        } 
    }; 
    var delPar={
    	type:0,
    	lineColor:"#5CB93C",
    	speed:20,
    	flow0color:'rgba(255,255,255,1)',
    	flow1color:'rgba(255,255,255,0)',
    	arrow:true,
    	beginCallbak:function(){},
    	endCallbak:function(){}
    };
    flowLine.delParameter={};
	$.fn.flowLine = function(pro){
		var newpro = getNewPro(pro,getNewPro(flowLine.delParameter,delPar));
		if(newpro.type == 2){
	        var discount = new Discount (newpro,$(this).get(0)); 
	        discount.init();
	        discount.drawEyelid(false);
	        return discount;
		}else if(newpro.type == 1){
			var rightAngleLine = new RightAngleLine (newpro,$(this).get(0)); 
	        rightAngleLine.init();
	        rightAngleLine.drawEyelid(false);
	        return rightAngleLine;
		}else{
			var straightLine = new StraightLine (newpro,$(this).get(0)); 
	        straightLine.init();
	        straightLine.drawEyelid(false);
	        return straightLine;
		}
	}
	function getNewPro(pro,oldpro){
		var newpor={}
		newpor.type = pro.type!=null&&pro.type!=undefined?pro.type:oldpro.type;
		newpor.lineColor = pro.lineColor!=null&&pro.lineColor!=undefined?pro.lineColor:oldpro.lineColor;
		newpor.speed = pro.speed!=null&&pro.speed!=undefined?pro.speed:oldpro.speed;
		newpor.flow0color = pro.flow0color!=null&&pro.flow0color!=undefined?pro.flow0color:oldpro.flow0color;
		newpor.flow1color = pro.flow1color!=null&&pro.flow1color!=undefined?pro.flow1color:oldpro.flow1color;
		newpor.arrow = pro.arrow!=null&&pro.arrow!=undefined?pro.arrow:oldpro.arrow;
		newpor.beginCallbak = pro.beginCallbak!=null&&pro.beginCallbak!=undefined?pro.beginCallbak:oldpro.beginCallbak;
		newpor.endCallbak = pro.endCallbak!=null&&pro.endCallbak!=undefined?pro.endCallbak:oldpro.endCallbak;
		return newpor;
	}
	 function BezierEllipse(sty,ctx, x, y, b, a)
	{
	   var k = .5522848,
	   ox = a * k, // 水平控制点偏移量
	   oy = b * k; // 垂直控制点偏移量
	
	   ctx.beginPath();
	   ctx.fillStyle=sty;
	   //从椭圆的左端点开始顺时针绘制四条三次贝塞尔曲线
	   ctx.moveTo(x, y - b);
	   ctx.bezierCurveTo(x - ox, y - b, x - a, y - oy, x-a, y);
	   ctx.bezierCurveTo(x - a, y + ox, x - ox, y + b, x, y + b);
	   ctx.bezierCurveTo(x + ox, y + b, x + a, y + oy, x + a, y);
	   ctx.bezierCurveTo(x + a, y - oy, x + ox, y - b, x, y - b);
	   ctx.closePath();
	   ctx.fill();
	   ctx.restore (); 
	   
	};
    function BezierEllipse2(sty,ctx, x, y, a, b)
	{
	   var k = .5522848,
	   ox = a * k, // 水平控制点偏移量
	   oy = b * k; // 垂直控制点偏移量
	
	   ctx.beginPath();
	   ctx.fillStyle=sty;
	   //从椭圆的左端点开始顺时针绘制四条三次贝塞尔曲线
	   ctx.moveTo(x - a, y);
	   ctx.bezierCurveTo(x - a, y - oy, x - ox, y - b, x, y - b);
	   ctx.bezierCurveTo(x + ox, y - b, x + a, y - oy, x + a, y);
	   ctx.bezierCurveTo(x + a, y + oy, x + ox, y + b, x, y + b);
	   ctx.bezierCurveTo(x - ox, y + b, x - a, y + oy, x - a, y);
	   ctx.closePath();
	   ctx.fill();
	   ctx.restore (); 
	   
	};
	
})(jQuery,document, window.flowLine = {});